<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<div id="app" class="demo-input-size">
    <div style="padding-bottom: 20px;">
        <el-input
                v-model="searchInfo.aname"
                size="medium"
                placeholder="请输入姓名"
                suffix-icon=""
                style="display:inline-block;width: 200px;">
        </el-input>
        <el-input
                v-model="searchInfo.asex"
                size="medium"
                placeholder="请输入性别"
                suffix-icon=""
                style="display:inline-block;width: 200px;">
        </el-input>
        <el-input
                v-model="searchInfo.rname"
                size="medium"
                placeholder="请输入职位"
                suffix-icon=""
                style="display:inline-block;width: 200px;">
        </el-input>
        <el-input
                v-model="searchInfo.dname"
                size="medium"
                placeholder="请输入部门"
                suffix-icon=""
                style="display:inline-block;width: 200px;">
        </el-input>
        <el-button type="primary" @click="searchAdminInfo()">查询</el-button>
        <el-button type="success" @click="exportAdmin()">下载</el-button>
    </div>
    <el-table
            :data="adminArr"
            border
            style="width: 100%">
        <el-table-column
                fixed
                prop="aname"
                label="姓名"
                width="120">
        </el-table-column>
        <el-table-column
                prop="asex"
                label="性别"
                width="60">
        </el-table-column>
        <el-table-column
                prop="aphone"
                label="手机号"
                width="120">
        </el-table-column>
        <el-table-column
                prop="aidcard"
                label="身份证号"
                width="220">
        </el-table-column>
        <el-table-column
                prop="education.education"
                label="学历"
                width="100">
        </el-table-column>
        <el-table-column
                prop="aaddress"
                label="家庭住址"
                width="120">
        </el-table-column>
        <el-table-column
                prop="aachievement"
                label="成就"
                width="120">
        </el-table-column>
        <el-table-column
                prop="amotto"
                label="人生格言"
                width="120">
        </el-table-column>
        <el-table-column
                prop="abirthday"
                label="生日"
                width="120">
        </el-table-column>
        <el-table-column
                prop="role.rname"
                label="职位"
                width="80">
        </el-table-column>
        <el-table-column
                prop="dept.dname"
                label="部门"
                width="120">
        </el-table-column>
        <el-table-column
                prop="office.oname"
                label="科室"
                width="120">
        </el-table-column>
        <el-table-column
                prop="ahiredate"
                label="入职日期"
                width="120">
        </el-table-column>
        <el-table-column
                prop="adimission"
                label="离职日期"
                width="120">
        </el-table-column>
    </el-table>
    <el-pagination
            background
            @current-change="handleCurrentChange"
            layout="prev, pager, next"
            :total="totalCount"
            :page-size="pagesize">
    </el-pagination>
</div>
<script>
    var haha = new Vue({
        el:"#app",
        data:{
            searchInfo:{
                aname:"",
                asex:"",
                dname:"",
                rname:""

            },
            adminArr:[],
            totalCount:0,
            pagesize:6
        },
        methods:{
            searchAdminInfo(){
                getData(1,6);
            },
            handleCurrentChange( val  ){
                getData(val,6);
            },
            downloadAdminDemo(){
                window.location.href = "/demo/admin/员工信息表（模板）.xlsx";
            },
            exportAdmin(){
                window.location.href =  "/demo/adminsource/download?" +
                                        "aname="+haha.searchInfo.aname+
                                        "&asex="+haha.searchInfo.asex+
                                        "&dname="+haha.searchInfo.dname+
                                        "&rname="+haha.searchInfo.rname+
                                        "&pageNO=1&pageCount=5000";
            }
        }
    });
    function getData( a , b ) {
        haha.searchInfo.pageNO = a;
        haha.searchInfo.pageCount = b;
        $.post("/demo/adminInfo/query",haha.searchInfo,function (backData) {
            haha.adminArr = backData.data.currentData;
            haha.totalCount = backData.data.totalCount;
        });
    }
    getData(1,6);
</script>
</body>
</html>